<template>
  <div class="albumsBody">
      <Album 
        v-for="item in $attrs.list"
        :key="keys(item.id)"
        :item="item"
      ></Album>
      <button v-if="$attrs.page<1" @click="getMore" class="open-app">更多</button>
      <p v-else  class="open-app noMore">真的一滴也没有了</p>
  </div>
</template>

<script>
import Album from "components/home/albums/Album"
export default {

    components:{
        Album
    },
    
    methods:{
        getMore(){
            this.$emit("getMore")
        },
        keys(key){
            return key+new Date().getTime()+Math.random()
        }
    }
}
</script>

<style lang="stylus" scoped>
.albumsBody
    padding .1rem 0
    min-height 3.2rem
    display flex
    flex-wrap wrap
    align-items center
    justify-content space-between
    margin 0 .14rem
    .open-app
        display block
        text-align center
        line-height .3rem
        width 80%
        height .3rem
        margin .1rem auto 
        background-color #e0e0e0
        border-radius .03rem
        border none 
        font-size .14rem
    .noMore
        background none
        color #616161
</style>